<template>
  <div>
    <Row>
      <Col span="24">
      <topmenu></topmenu>
      </Col>
    </Row>
    <Row>
      <Col span="4" class="leftBar" >
      <leftmenu></leftmenu>
      </Col>
      <Col span='20' class="rightContent"  ref="nana">
      <router-view></router-view>
      </Col>
    </Row>
  </div>
</template>

<script>
  import leftMenu from './nav/leftMenu'
  import topMenu  from './nav/topMenu'

  export default {

    data () {
      return {

      }
    },
    computed:{
      windowHeight:function(){
        return  window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
      }
    },

    mounted:function () {
      this.$nextTick(function () {
        let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
        this.$refs.nana.style.height = h +'px';
      });

    },
    components:{
      'leftmenu':leftMenu,
      'topmenu':topMenu
    }
  }
</script>
<style scoped>
  .rightContent{background-color: #fff;overflow-x: hidden;overflow-y: auto;height: 705px;}
</style>
